import React, { Component } from "react";
import PropTypes from "prop-types";
import Item from "../Item";
import "./index.css";
export default class List extends Component {
  static propTypes = {
    todos: PropTypes.array.isRequired,
    delTodo: PropTypes.func.isRequired,
    checkedTodo: PropTypes.func.isRequired
  };
  render() {
    const { todos, delTodo, checkedTodo } = this.props;
    return (
      <ul className="list">
        {todos.map(todo => {
          return (
            <Item
              {...todo}
              key={todo.id}
              delTodo={delTodo}
              checkedTodo={checkedTodo}
            />
          );
        })}
      </ul>
    );
  }
}
